<template>
	<view class="vh-100">
		<view style="position:fixed;width: 100%;padding-bottom：30rpx;z-index:10" class="bg-white">
			<div style="height:30rpx;background-color: #fff"></div>
			<view :style="{height: statusBarHeight + 'px'}" class="bg-white"></view>
			<Title :title="title" class="bg-white" />
		</view>
		<!-- <view style="height:130rpx"></view> -->
		<view :style="`height: calc(${statusBarHeight}px + 120rpx)`"></view>
		<view class="bg-white ml-16 mr-16 rounded-26 flex between" style="height: 122rpx;" v-if="serviceUser" @click="goPerson">
			<view v-if="typeFlag == 1" class="topSty flex-start flex">
				<image :src="getImageUrl(orderInfo.u_avatar)" mode="aspectFill" class="w-55 h-55 ml-10"></image>
				<flag class="w-30 h-20 mr-4 ml-10" :country="orderInfo.country" />
				<span class="text-010 fz28 font-bold ml-12" style="max-width: 550rpx;">{{ orderInfo[plang('u_name')] }}</span>
				<span class="userSty ">{{ orderInfo[plang('identity_u_name')] }}</span>
			</view> 
			<view v-else-if="typeFlag == 2" class="topSty flex-start flex">
				<image :src="getImageUrl(orderInfo.avatar)" mode="aspectFill" class="w-55 h-55 ml-10"></image>
				<flag class="w-30 h-20 mr-4 ml-10" :country="orderInfo.country" />
				<span class="text-010 fz28 font-bold ml-12" style="max-width: 550rpx;">{{ orderInfo[plang('r_name')] }}</span>
				<span class="userSty ">{{ orderInfo[plang('identity_name')] }}</span>
			</view> 
			<p class="fz28 text-888 w-100 mr-18">{{$t('服务商')}}</p>
		</view>
		<view class="bg-white ml-16 mr-16 rounded-26 flex" style="height: 122rpx;" v-else @click="goPerson">
			<view v-if="typeFlag == 1" class="topSty flex-start flex">
				<image :src="getImageUrl(orderInfo.u_avatar)" mode="aspectFill" class="w-55 h-55 ml-10"></image>
				<flag class="w-30 h-20 mr-4 ml-10" :country="orderInfo.country" />
				<span class="text-010 fz28 font-bold ml-12" style="max-width: 550rpx;">{{ orderInfo[plang('u_name')] }}</span>
				<span class="userSty ">{{ orderInfo[plang('identity_u_name')] }}</span>
			</view> 
			<view v-else-if="typeFlag == 2" class="topSty flex-start flex">
				<image :src="getImageUrl(orderInfo.avatar)" mode="aspectFill" class="w-55 h-55 ml-10"></image>
				<flag class="w-30 h-20 mr-4 ml-10" :country="orderInfo.country" />
				<span class="text-010 fz28 font-bold ml-12" style="max-width: 550rpx;">{{ orderInfo[plang('r_name')] }}</span>
				<span class="userSty ">{{ orderInfo[plang('identity_name')] }}</span>
			</view> 
		</view>
		<view class="bg-white ml-16 mr-16 rounded-26 mt-16 pb-35">
			<p class=" text-010 fz28 font-bold pt-36 ml-18">{{$t('订单内容')}}</p>
			<view class="contentSty mt-24 pt-14 pl-15">
				{{ orderInfo[plang('r_content')] }}
			</view>
			<p class=" text-010 fz28 font-bold mt-44 ml-18">{{$t('订单金额')}}</p>
			<view class="inputSty mt-24 pt-14 pl-15">
				{{ orderInfo.amount }}
			</view>
		</view>
		<view class="between h-100 bg-white ml-16 mr-16 mt-16 rounded-26">
			<p class="fz28 text-010 font-bold ml-18">{{$t('服务种类')}}</p>
			<p class="fz28 text-888 font-bold mr-24">{{ orderInfo[plang('service')] }}</p>
		</view>
		
		<view class="empty"></view>
		<view class="footer_btn4">
			<u-button class="btn_blue" @click.stop="callPhone">
				{{ $t('打电话') }}
				<image
					src="/static/translatexx.png"
					class="translatexxxxxx"
					mode="widthFix"
				/>
			</u-button>
			<u-button class="btn_green" @click.stop="inlineCall">
				{{ $t('发消息') }}
			</u-button>
		</view>
	</view>
</template>

<script>
	import Title from '../components/title.vue'
	import { getInfo, request_minute, chechkIm } from '@/api/basic.js'
	
	
	export default {
		components: {
			Title
		},
		data() {
			return {
				title: this.$t('订单详情'),
				statusBarHeight: uni.getStorageSync('statusBarHeight') || 0,
				serviceUser: false,
				user_id: uni.getStorageSync("user_id"),
				orderInfo: {},
				typeFlag: 0
			}
		},
		/**
		 * 0、供应商 ；1、经销商 ；2、货运代理公司 ；
		 * 3、采购商 ；4、服务公司 ；5、报关公司 ；6、境内物流公司 ；
		 * 7、国际物流公司 ；8、司机 ；9、业务员 ；10、俄罗斯个人 ；
		 */
		onLoad(options) {
			if (options.serviceUser) {
				this.serviceUser = JSON.parse(options.serviceUser)
			}
			if(options.orderNo) {
				this.typeFlag = options.type
				console.log('this.typeFlag--', this.typeFlag)
				 this.getInfo(options.orderNo, options.type)
			}
		  },
		  // mounted() {
		  // 	this.getInfo()
		  // },
		methods: {
			goPerson() {
        if (	this.orderInfo.identity_type == 0) {
          uni.navigateTo({
            url: `/pages/details/merchantDetail?bid=${this.orderInfo.bid}`,
            webview: 'zWebViewShop'
          })
        } else {
          uni.navigateTo({
            url: `/pages/myPersonPage/index?targetUserId=${	this.typeFlag == 2 ? this.orderInfo.r_user_id : this.orderInfo.user_id}`,
            webview: 'zWebView'
          })
        }
      },
			inlineCall(info) {
				console.log('info---', info)
				if (this.typeFlag == 1) {
					
				


					if(uni.getStorageSync("user_id") ==  this.orderInfo.user_id) {
						uni.showToast({
							title: this.$t('不能和自己聊天'),
							icon: "none",
						});
					} else {
						this.isMessageGo({
							action: 'initiateChat',
							data:  this.orderInfo.user_id
						})
						return;
						chechkIm({
							send_uid: uni.getStorageSync("user_id"),
							receive_uid:  this.orderInfo.user_id,
						}).then(res => {
							if (res.data.code == 1) {
								this.isMessageGo({
									action: 'initiateChat',
									data:  this.orderInfo.user_id
								})
							} else {
								if (res.data.data.send_user == false) {
									uni.$u.toast(this.$t('积分不足，请充值积分'))
									setTimeout(() => {
										uni.navigateTo({
											url: '/pages/vip/scorePoint',
										})
									}, 500)
								} else {
									uni.$u.toast(this.$t('对方积分不足'))
								}
							}
						})
					}


				} else {
					if(uni.getStorageSync("user_id") ==  this.orderInfo.r_user_id) {
						uni.showToast({
							title: this.$t('不能和自己聊天'),
							icon: "none",
						});
					} else {
						this.isMessageGo({
							action: 'initiateChat',
							data:  this.orderInfo.r_user_id
						})
						return;
						chechkIm({
							send_uid: uni.getStorageSync("user_id"),
							receive_uid:  this.orderInfo.r_user_id,
						}).then(res => {
							if (res.data.code == 1) {
								this.isMessageGo({
									action: 'initiateChat',
									data:  this.orderInfo.r_user_id
								})
							} else {
								if (res.data.data.send_user == false) {
									uni.$u.toast(this.$t('积分不足，请充值积分'))
									setTimeout(() => {
										uni.navigateTo({
											url: '/pages/vip/scorePoint',
										})
									}, 500)
								} else {
									uni.$u.toast(this.$t('对方积分不足'))
								}
							}
						})
					}
				}
				
			},
			callPhone() {
				if (this.typeFlag == 1 ) {
					console.log('999999', uni.getStorageSync("user_id"), this.orderInfo)
					if(uni.getStorageSync("user_id") == this.orderInfo.user_id) {
						uni.showToast({
							title: this.$t('不能给自己打电话'),
							icon: "none",
						});
					} else {
						request_minute({
							user_id: uni.getStorageSync("user_id"),
							target_id: this.orderInfo.user_id,
						}).then(res => {
							if (res.data.data.flag == 1) {
								this.isMessageGo({
									action: 'call',
									data: {
										userId: this.orderInfo.user_id,
										type: res.data.data.type || 1,
									}
								})
							} else {
								uni.showToast({
									title: this.$t('积分不足，请充值积分'),
									icon: "none",
								});
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/vip/scorePoint',
										webview: 'zWebView'
									})
								}, 500)
							}
						})
					}
				} else {
					console.log('999999', uni.getStorageSync("user_id"), this.orderInfo)
					if(uni.getStorageSync("user_id") == this.orderInfo.r_user_id) {
						uni.showToast({
							title: this.$t('不能给自己打电话'),
							icon: "none",
						});
					} else {
						request_minute({
							user_id: uni.getStorageSync("user_id"),
							target_id: this.orderInfo.r_user_id,
						}).then(res => {
							if (res.data.data.flag == 1) {
								this.isMessageGo({
									action: 'call',
									data: {
										userId: this.orderInfo.r_user_id,
										type: res.data.data.type || 1,
									}
								})
							} else {
								uni.showToast({
									title: this.$t('积分不足，请充值积分'),
									icon: "none",
								});
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/vip/scorePoint',
										webview: 'zWebView'
									})
								}, 500)
							}
						})
					}
				}
				
			},
			getInfo(on, type) {
				getInfo({on: on , user_id: this.user_id, type: type}).then(res => {
					if(res.data.code == 200) {
						this.orderInfo = res.data.data.data || {}
						console.log('this.orderInfo999', this.orderInfo)
					} else {
						// uni.$u.toast(res.data.message)
						uni.$u.toast(res.data[this.plang('message')])
					}
				})
			}
		}
	}
</script>


<style lang="scss">
	@import '@/assets/appScss.scss';
	page {
			background: #F6F7FB;
		}
		.topSty {
			background: linear-gradient(113.85deg, #EEF6FF -2.69%, rgba(255, 255, 255, 0) 47.5%);
			height: 110rpx;
			width: 100%;
			margin-left: 10rpx;
			border-radius: 26rpx;
			.userSty {
				background-image: url('../../../../static/userLogoBg.png');
				background-size: 100% 100%;
				margin-left: 12rpx;
				min-width: 120rpx;
				font-family: YouSheBiaoTiHei;
				font-weight: 400;
				font-size: 20rpx;
				line-height: 30rpx;
				box-shadow: 0rpx 1.25rpx 0.75rpx 0rpx #D061024D;
				color: #FFFFFF;
				text-align: center;
				padding-left: 26rpx;
			}
		}
		.contentSty {
			min-height: 200rpx;
			background-color: #F7F7F7;
			margin-left: 18rpx;
			margin-right: 18rpx;
			border-radius: 18rpx;
		}
		.inputSty {
			height: 80rpx;
			background-color: #F7F7F7;
			margin-left: 18rpx;
			margin-right: 18rpx;
			border-radius: 18rpx;
		}
		.empty {
			width: 100%;
			height: 200rpx;
		}
		.footer_btn4{
			position: fixed;
			left:0;
			bottom: 0;
			right: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			background: #fff;
			padding:30rpx 24rpx 60rpx;
			/deep/ .u-btn {
				padding: 0 !important;
			}
			/deep/ uni-button {
				padding: 0 !important;
				margin: 0 !important;
			}
			/deep/ .u-hairline-border[data-v-3bf2dba7]:after {
				border: none !important;
			}
			.btn_blue{
				width: 49%;
				height: 94rpx;
				flex-shrink: 0;
				border-radius: 18rpx 0 0 18rpx;
				// border: 2rpx solid rgba(3, 189, 130, 0.10);
				background-color: #278AFF;
				color: #FFF;
				font-family: "PingFang SC";
				font-size: 30rpx;
				font-style: normal;
				font-weight: 600;
				text-align: center;
				line-height: 94rpx;
				padding: 0;
			}
			.btn_green{
				width: 49%;
				height: 94rpx;
				flex-shrink: 0;
				border-radius: 0 18rpx 18rpx 0;
				// border: 2rpx solid rgba(3, 189, 130, 0.10);
				background-color: #03C24F;
				color: #FFF;
				font-family: "PingFang SC";
				font-size: 30rpx;
				font-style: normal;
				font-weight: 600;
				text-align: center;
				line-height: 94rpx;
				padding: 0;
			}
		}
</style>
